@import "base.scss";

.container {
  display: inline-block;
  width: 6ex;
  height: 6ex;
  box-sizing: border-box;

  background-color: $container-color;

  font-family: 'Lato', sans-serif;
  font-size: $font30;
  line-height: $font30;
  font-weight: 300;
  text-transform: lowercase;

  margin: 0;
  padding: 1.7ex 0 0;
  text-align: center;
  outline: 0;

  @media screen and (max-width: $small) {
    font-size: $font20;
    line-height: $font20;
  }

  &.small {
    font-size: $font20;
    line-height: $font20;
  }

  .if {
    color: $header-text-color;
  }

  .me {
    display: inline-block;
    border-bottom: 0.11ex solid $highlight-text-color;
    border-top: 0.11ex solid $highlight-text-color;
    color: $highlight-text-color;
    margin: 0 0 0 0.5ex;
    padding: 0 0 0.55ex;
  }
}
